<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="/js/jquery-3.5.0.min.js" type="text/javascript"></script>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/components.css">
    <link rel="stylesheet" href="/css/login.css">
    <title>用户注册</title>
</head>
<body class="login">
<div class="content">
    <h3>用户注册</h3>
    <div>
        <label class="control-label" for="otpCode">验证码</label>
        <div>
            <input class="form-control" type="text" name="otpCode" id="otpCode">
        </div>
        <label class="control-label" for="name">用户名</label>
        <div>
            <input class="form-control" type="text" name="name" id="name">
        </div>
        <label class="control-label" for="password">密码</label>
        <div>
            <input class="form-control" type="password" name="password" id="password">
        </div>
        <label class="control-label" for="gender">性别</label>
        <div>
            <input class="form-control" type="text" name="gender" id="gender">
        </div>
        <label class="control-label" for="age">年龄</label>
        <div>
            <input class="form-control" type="text" name="age" id="age">
        </div>
        <div class="form-actions">
            <button class="btn red-thunderbird" type="submit" id="getotp">点击注册</button>
        </div>
    </div>
</div>


</body>
<script>
    $(function () {
        var telephone = window.localStorage['telephone']
        if (telephone==null){
          alert("请先验证手机号！")
          window.location.href="/html/get_otp_code.html"
        }

        $("#getotp").on("click", function () {
            $.ajax({
                type: "POST",
                contentType: "application/x-www-form-urlencoded",
                url: "/user/register?telephone=" + telephone,
                data: {
                    "otpCode": $("#otpCode").val(),
                    "name": $("#name").val(),
                    "password": $("#password").val(),
                    "gender": $("#gender").val(),
                    "age": $("#age").val()
                },
                success: function (data) {
                    if (data.status === "success") {
                        alert("注册成功");
                    } else {
                        alert("注册失败：" + data.data.errorMsg);
                    }
                },
                error: function (data) {
                    alert("注册失败！" + data.responseText)
                }
            })
        })
    })
</script>
</html>
